|
前言
前端：Thymeleaf、bootstrap、jQuery 后端：SpringBoot、Mybatis 数据库：MySQL 工具：IDEA 环境：JDK1.8、Maven
一、创建表，添加数据
1、创建数据库：CREATE table users (id int(20) auto_increment primary key,name VARCHAR(20) not null,age int(20) not null,sex varchar(20) not null,address varchar(30) not null);
2、插入数据：insert into users (name,age,sex,address) values("詹姆斯",36,"男","洛杉矶湖人");
3、插入几条数据后如下图： 
二、IDEA创建SpringBoot项目
  
1、在 pom.xml 中配置项目依赖
4.0.0
org.springframework.boot
spring-boot-starter-parent
2.2.7.RELEASE
cn.lemon
demo
0.0.1-SNAPSHOT
demo
Demo project for Spring Boot
UTF-8
UTF-8
1.8
org.springframework.boot
spring-boot-starter-thymeleaf
org.springframework.boot
spring-boot-starter-web
org.springframework.boot
spring-boot-starter-jdbc
org.mybatis.spring.boot
mybatis-spring-boot-starter
2.1.1
mysql
mysql-connector-java
5.1.46
org.springframework.boot
spring-boot-starter-test
test
org.junit.vintage
junit-vintage-engine
junit
junit
4.12
test
org.springframework.boot
spring-boot-maven-plugin
2、启动类 DemoApplication.java
package cn.lemon.demo;
import org.mybatis.spring.annotation.MapperScan;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
@MapperScan("cn.lemon.demo.dao")
public class DemoApplication {
public static void main(String[] args) {
SpringApplication.run(DemoApplication.class, args);
}
}
3、配置文件application.properties
## 端口
server.port=8083
##数据源配置
spring.datasource.url=jdbc:mysql://localhost:3306/db_users
spring.datasource.username=root
spring.datasource.password=root
spring.datasource.driver-class-name=com.mysql.jdbc.Driver
##MyBatis配置
mybatis.mapper-locations=classpath*:mybatis/*.xml
mybatis.type-aliases-package=cn.lemon.demo.domain
#thymelea模板配置
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.mode=HTML5
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.servlet.content-type=text/html
#热部署文件，页面不产生缓存，及时更新
#关闭模板缓存
spring.thymeleaf.cache=false
#spring.resources.chain.strategy.content.enabled=true
#spring.resources.chain.strategy.content.paths=/**
三、后端代码编写
1、创建实体类 User.java 映射数据库user表
package cn.lemon.demo.domain;
public class User {
private String address;
private int age;
private Integer id;
private String name;
private String sex;
public String getAddress() {
return address;
}
public void setAddress(String address) {
this.address = address;
}
public int getAge() {
return age;
}
public void setAge(int age) {
this.age = age;
}
public Integer getId() {
return id;
}
public void setId(Integer id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getSex() {
return sex;
}
public void setSex(String sex) {
this.sex = sex;
}
}
2、创建数据库访问层 IUserDao.java 接口、IUserDao.xml 映射文件，对数据库表的增删改查
package cn.lemon.demo.dao;
import cn.lemon.demo.domain.User;
import org.springframework.stereotype.Repository;
import java.util.List;
@Repository
public interface IUserDao {
public int add(User user);
public int delete(Integer id);
public List findAll();
public User findById(Integer id);
public List findByName(String name);
public int update(User user);
}
INSERT INTO
`user`(`name`,`age`,`sex`,`address`)
VALUES
(#{name},#{age},#{sex},#{address})
delete from user where id = #{id}
select * from user
select * from user where id = #{id}
select * from user where name like concat(concat('%',#{name}),'%')
update user set name=#{name},age=#{age},sex=#{sex},address=#{address} where user.id=#{id}
3、创建业务逻辑层 IUserService.java接口以及UserServiceImpl.java实现类
package cn.lemon.demo.service;
import cn.lemon.demo.domain.User;
import java.util.List;
public interface IUserService {
public int add(User user);
public int delete(Integer id);
public List findAll();
public User findById(Integer id);
public List findByName(String name);
public int update(User user);
}
package cn.lemon.demo.service.impl;
import cn.lemon.demo.dao.IUserDao;
import cn.lemon.demo.domain.User;
import cn.lemon.demo.service.IUserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.util.List;
@Service
public class UserServiceImpl implements IUserService {
@Autowired
private IUserDao iUserDao;
@Override
public int add(User user) {
return iUserDao.add(user);
}
@Override
public int delete(Integer id) {
return iUserDao.delete(id);
}
@Override
public List findAll() {
return iUserDao.findAll();
}
@Override
public User findById(Integer id) {
return iUserDao.findById(id);
}
@Override
public List findByName(String name) {
return iUserDao.findByName(name);
}
@Override
public int update(User user) {
return iUserDao.update(user);
}
}
4、创建控制层 UserController.java
package cn.lemon.demo.web.controller;
import cn.lemon.demo.domain.User;
import cn.lemon.demo.service.impl.UserServiceImpl;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.*;
import javax.annotation.Resource;
import java.util.List;
@Controller
@RequestMapping("/user")
public class UserController {
@Resource
private UserServiceImpl userService;
@GetMapping("/delete/{id}")
public String delete(@PathVariable Integer id) {
userService.delete(id);
return "redirect:/user/userList";
}
@RequestMapping("/insertPage")
public String insertPage() {
return "insertPage";
}
@RequestMapping("/insert")
public String insert(User user) {
userService.add(user);
return "redirect:/user/userList";
}
@RequestMapping("/select/{id}")
@ResponseBody
public String select(@PathVariable int id) {
return userService.findById(id).toString();
}
@GetMapping("/updatePage/{id}")
public String updatePage(Model model, @PathVariable int id) {
User user = userService.findById(id);
model.addAttribute("user", user);
return "updatePage";
}
@PostMapping("/update")
public String update(User user) {
userService.update(user);
return "redirect:/user/userList";
}
@RequestMapping("/userList")
public String userList(Model model) {
List users = userService.findAll();
model.addAttribute("users", users);
return "userList";
}
@RequestMapping("/find")
public String userFind(Model model,String name) {
List users = userService.findByName(name);
model.addAttribute("users", users);
return "userList";
}
}
5、服务层测试 UserServiceImplTest.java（Ctrl + Shift + T）
package cn.lemon.demo.service.impl;
import cn.lemon.demo.domain.User;
import org.junit.jupiter.api.Test;
import org.junit.runner.RunWith;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.boot.test.context.SpringBootTest;
import org.springframework.test.context.junit4.SpringRunner;
import java.util.List;
import static org.junit.jupiter.api.Assertions.*;
@SpringBootTest
@RunWith(SpringRunner.class)
class UserServiceImplTest {
@Autowired
private UserServiceImpl userService;
@Test
void add() {
User user = new User();
user.setName("莱昂纳德");
user.setAge(30);
user.setSex("男");
user.setAddress("洛杉矶快船");
userService.add(user);
}
@Test
void delete() {
userService.delete(10);
}
@Test
void findAll() {
List userList = userService.findAll();
for (User user : userList) {
System.out.println(user.getName());
}
}
@Test
void findById() {
User user = userService.findById(1);
System.out.println(user.getName() + user.getAddress());
}
@Test
void findByName() {
List userList = userService.findByName("詹");
for (User user : userList) {
System.out.println(user.getName() + user.getAddress());
}
}
@Test
void update() {
User user = new User();
user.setId(14);
user.setName("隆多");
user.setAge(35);
user.setSex("男");
user.setAddress("洛杉矶湖人");
userService.update(user);
}
}
四、前端页面编写
1、导入 CSS、JavaScript
路径：demo\src\main\resources\static\css\bootstrap.css路径：demo\src\main\resources\static\js\bootstrap.min.js路径：demo\src\main\resources\static\js\jquery.min.js
注意：
SpringBoot项目创建后,resources下默认有两个文件夹static和template.一般static存放静态资源,template存放动态资源
2、在\resources\template创建userList.html列表页面
用户列表
a {
color: #fff;
}
用户列表
|